<template>
  <div class="card col-12">
    <div class="card-body">
      <form class="form-horizontal">
        <div class="row">
          <label class="control-label col-3 ms-auto text-end"
            >国内机票让利金额（公布运价）</label
          >
          <div class="col-4 me-auto">
            <input
              type="input"
              class="form-control"
              v-model.number="domFlightDiscount"
            />
          </div>
        </div>
        <div class="row">
          <label class="control-label col-3 ms-auto text-end"
            >国际机票让利金额（接口返回价格）</label
          >
          <div class="col-4 me-auto">
            <input
              type="input"
              class="form-control"
              v-model.number="intlFlightDiscount"
            />
          </div>
        </div>
        <div class="row">
          <label class="control-label col-3 ms-auto text-end"
            >酒店让利金额</label
          >
          <div class="col-4 me-auto">
            <input
              type="input"
              class="form-control"
              v-model.number="hotelDiscount"
            />
          </div>
        </div>
        <div class="row">
          <label class="control-label col-3 ms-auto text-end"
            >用车让利金额</label
          >
          <div class="col-4 me-auto">
            <input
              type="input"
              class="form-control"
              v-model.number="carDiscount"
            />
          </div>
        </div>
        <div class="row">
          <label class="control-label col-3 ms-auto text-end"
            >登机牌办理让利金额</label
          >
          <div class="col-4 me-auto">
            <input
              type="input"
              class="form-control"
              v-model.number="boardingCardDiscount"
            />
          </div>
        </div>

        <div class="row">
          <button
            id="btnChange"
            type="button"
            class="btn btn-primary  col-4 offset-4"
            @click.stop="saveCustomerDiscount()"
          >
            保存
          </button>
        </div>
      </form>
    </div>
  </div>
</template>

<script>
import {
  searchCustomerDiscountInfo,
  saveCustomerDiscountInfo,
} from "@/api/customer.js";
import MyModalPrompt from "@/components/modal/my-modal-prompt.vue";

export default {
  props: {
    customerId: {
      type: Number,
    },
  },
  components: {
    MyModalPrompt,
  },
  data() {
    return {
      modalTitle: "",
      saving: false,

      domFlightDiscount: 0,
      intlFlightDiscount: 0,
      hotelDiscount: 0,
      carDiscount: 0,
      boardingCardDiscount: 0,
    };
  },
  computed: {
    isAdmin() {
      return this.$store.getters.isAdmin;
    },
  },
  mounted: function () {
    this.searchDiscountInfo();
  },
  methods: {
    showErrMsg: function (msg, msgType) {
      this.$store.dispatch("showAlertMsg", {
        errMsg: msg,
        errMsgType: msgType,
      });
    },
    showLoading: function (msg) {
      this.$store.dispatch("showLoading", { loadingText: msg });
    },
    hideLoading: function () {
      this.$store.dispatch("hideLoading");
    },
    searchDiscountInfo: function () {
      searchCustomerDiscountInfo(this.customerId, (v) => {
        // console.log(v)
        this.hotelDiscount = v.hotelDiscount;
        this.carDiscount = v.carDiscount;
        this.boardingCardDiscount = v.boardingCardDiscount;
        this.domFlightDiscount = v.domFlightDiscount;
        this.intlFlightDiscount = v.intlFlightDiscount;
      });
    },
    saveCustomerDiscount: function () {
      const params = {
        domFlightDiscount: this.domFlightDiscount,
        intlFlightDiscount: this.intlFlightDiscount,
        hotelDiscount: this.hotelDiscount,
        carDiscount: this.carDiscount,
        boardingCardDiscount: this.boardingCardDiscount,
      };
      saveCustomerDiscountInfo(this.customerId, params, (v) => {
        if (v.status === "OK") {
          this.showErrMsg("保存成功");
        } else {
          this.showErrMsg("保存失败：" + v.errmsg, "danger");
        }
      });
    },
  },
};
</script>